<template>
  <div>
      <div class="son">
     <h3>我是子组件</h3>
      <div>这是来自父组件的信息 props:>>{{ts}}</div>
      <input type="text" v-model='tofa'>
      <button @click="to">向父组件发送信息</button>
      </div>
  </div>
</template>

<script lang='ts'>
import { reactive, toRefs } from 'vue'
export default {
    props:['ts'],
   setup(props, context){
     let state=reactive({
       tofa:''
     })




     let to=()=>{
      context.emit('getSon',state.tofa)
     }

     return {
         ...toRefs(state),
         to
     }
   }
}
</script>

<style scoped>
  .son{
      width: 600px;
      height: 300px;
      border: 2px solid red;
      margin-top: 50px;
  }
</style>